 
 import {useCounterStore} from '../stores/user'
 import Vlistcs from '../components/Vlistcs.vue'


 let myvue=(app:any)=>{
    let UserData= useCounterStore()
    //权限
app.directive('delete',{
     mounted(el:any, binding:any) {
          let a =UserData.userdata.permissions
        // el 指令绑定的真实dom元素
        // binding 指令绑定信息
        const btn=binding.value
        console.log(btn,'btn');
        if (!a.includes(btn)) {
            console.log('没有权限');
            el.remove()
        }
    }
})
app.directive('update',{
     mounted(el:any, binding:any) {
         let a =UserData.userdata.permissions
        // el 指令绑定的真实dom元素
        // binding 指令绑定信息
        const btn=binding.value
        if (!a.includes(btn)) {
            el.remove()
        }
    }
})
app.directive('add',{
     mounted(el:any, binding:any) {
         let a =UserData.userdata.permissions
        // el 指令绑定的真实dom元素
        // binding 指令绑定信息
        const btn=binding.value
        if (!a.includes(btn)) {
            el.remove()
        }
    }
})
app.directive('look',{
     mounted(el:any, binding:any) {
         let a =UserData.userdata.permissions
        // el 指令绑定的真实dom元素
        // binding 指令绑定信息
        const btn=binding.value
        if (!a.includes(btn)) {
            el.remove()
        }
    }
})

// 水印指令 - 增强版
app.directive('watermark', {
  mounted(el, binding) {
    // 合并配置参数
    const options = {
      text: binding.value || '默认水印',  // 水印文本
      fontSize: 16,                       // 字体大小
      color: 'rgba(0, 0, 0, 0.1)',        // 颜色和透明度
      rotate: -15,                        // 旋转角度
      zIndex: 9999,                       // 层级
      gap: 100,                           // 水印间距
      rows: 5,                            // 行数
      cols: 3                             // 列数
    };
    
    // 创建水印画布
    const canvas = document.createElement('canvas');
    canvas.width = options.gap * options.cols;
    canvas.height = options.gap * options.rows;
    
    const ctx = canvas.getContext('2d');
    if (!ctx) return;
    
    // 设置字体样式
    ctx.font = `${options.fontSize}px sans-serif`;
    ctx.fillStyle = options.color;
    ctx.textAlign = 'center';
    ctx.textBaseline = 'middle';
    ctx.rotate(options.rotate * Math.PI / 180);
    
    // 绘制多个水印
    for (let i = 0; i < options.cols; i++) {
      for (let j = 0; j < options.rows; j++) {
        const x = i * options.gap - canvas.width / 3;
        const y = j * options.gap - canvas.height / 3;
        ctx.fillText(options.text, x, y);
      }
    }
    
    // 创建水印背景
    const watermarkDiv = document.createElement('div');
    watermarkDiv.className = 'vue-watermark';
    watermarkDiv.style.cssText = `
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: ${options.zIndex};
      background-image: url(${canvas.toDataURL()});
    `;
    
    // 将水印添加到元素
    el.style.position = 'relative';
    el.appendChild(watermarkDiv);
    
    // 保存引用以便卸载时移除
    el.__watermark__ = watermarkDiv;
  },
  
  unmounted(el:any) {
    const watermarkDiv = el.__watermark__;
    if (watermarkDiv) el.removeChild(watermarkDiv);
    delete el.__watermark__;
  }
});

 // 注册虚拟列表组件
  app.component('Vlistcs',Vlistcs );
//防抖指令
  app.directive('debounce', {
  mounted(el, binding) {
    let timer: any;
    const delay = parseInt(binding.arg) || 300;
    el.addEventListener('click', () => {
      clearTimeout(timer);
      timer = setTimeout(() => binding.value(), delay);
    });
  }
});
//节流指令/ 节流指令 (简化版)
app.directive('throttle', {
  mounted(el, binding) {
    let timer: any;
    const interval = parseInt(binding.arg) || 300;
    let lastExec = 0;
    el.addEventListener('click', () => {
      const now = Date.now();
      
      if (now - lastExec > interval) {
        lastExec = now;
        binding.value();
      } else {
        clearTimeout(timer);
        timer = setTimeout(() => {
          lastExec = Date.now();
          binding.value();
        }, interval);
      }
    });
  }
});



 }
 export default myvue;




//   const myll={
//   install(){
//     console.log('myll');
//   }
//  }
//  const myll2=(app:any/*这个就是vue的跟容器对象*/)=>{
//   // app 注册全局组件，注册全局指令
//  }